<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<%@page contentType="text/html" pageEncoding="UTF-8" %>
<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Provider Headers</title>
        <script type="text/javascript">
            var i = 2;
            function addRowToTable(){
                var tbl = document.getElementById('tblSample');
                var lastRow = tbl.rows.length;
                window.row = tbl.insertRow(lastRow);
                i=tbl.rows.length;
                
                // header number cell
                var t=i-1;
                var headernumber = row.insertCell(0);
                var headnum = document.createTextNode("Header " + t);
                headernumber.appendChild(headnum);
                
                // header name cell
                var headername = row.insertCell(1);
                var headname = document.createElement('input');
                headname.setAttribute('type', 'text');
                headname.setAttribute('name', 'columnnames');
                headname.setAttribute('id', 'i'+i);
                headname.setAttribute('size', '40');
                headername.appendChild(headname);
                
                // header required cell
                var headerrequired = row.insertCell(2);
                var headreq = document.createElement("input");
                headreq.setAttribute('type', 'checkbox');
                headreq.setAttribute('id', 'c'+i);
                headerrequired.appendChild(headreq);
                
                //Hidden Field
                var hid = document.createElement('input');
                hid.setAttribute('type', 'hidden');
                hid.setAttribute('name', 'required');
                hid.setAttribute('value', 'false');
                hid.setAttribute('id','hi'+i);
                headerrequired.appendChild(hid);
                
                //check button
                var ch = document.createElement('input');
                ch.setAttribute('type', 'button');
                ch.setAttribute('name', 'Check');
                ch.setAttribute('value', 'Check');
                ch.setAttribute('onclick',' checkclicked('+i+'); ');
                headerrequired.appendChild(ch);
                
                //uncheck button
                var unch = document.createElement('input');
                unch.setAttribute('type', 'button');
                unch.setAttribute('name', 'UnCheck');
                unch.setAttribute('value', 'UnCheck');
                unch.setAttribute('onclick',' uncheckclicked('+i+'); ');
                headerrequired.appendChild(unch);
                
                //header type cell
                var headertype = row.insertCell(3);
                var headtype = document.createElement('select');
                headtype.setAttribute('name', 'columntypes');
                headtype.setAttribute('id', 't'+i);
                headtype.options[0] = new Option('TINYINT', 'TINYINT');
                headtype.options[1] = new Option('SMALLINT', 'SMALLINT');
                headtype.options[2] = new Option('MEDIUMINT', 'MEDIUMINT');
                headtype.options[3] = new Option('INT', 'INT');
                headtype.options[4] = new Option('BIGINT', 'BIGINT');
                headtype.options[5] = new Option('DECIMAL', 'DECIMAL');
                headtype.options[6] = new Option('FLOAT', 'FLOAT');
                headtype.options[7] = new Option('DOUBLE', 'DOUBLE');
                headtype.options[8] = new Option('BIT', 'BIT');
                headtype.options[9] = new Option('CHAR', 'CHAR');
                headtype.options[10] = new Option('VARCHAR', 'VARCHAR(45)');
                headtype.options[11] = new Option('TINYTEXT', 'TINYTEXT');
                headtype.options[12] = new Option('TEXT', 'TEXT');
                headtype.options[13] = new Option('MEDIUMTEXT', 'MEDIUMTEXT');
                headtype.options[14] = new Option('LONGTEXT', 'LONGTEXT');
                headtype.options[15] = new Option('BINARY', 'BINARY');
                headtype.options[16] = new Option('VARBINARY', 'VARBINARY(45)');
                headtype.options[17] = new Option('DATE', 'DATE');
                headtype.options[18] = new Option('DATETIME', 'DATETIME');
                headtype.options[19] = new Option('TIME', 'TIME');
                headtype.options[20] = new Option('TIMESTAMP', 'TIMESTAMP');
                headtype.options[21] = new Option('YEAR', 'YEAR');
                headtype.options[22] = new Option('TINYBLOB', 'TINYBLOB');
                headtype.options[23] = new Option('BLOB', 'BLOB');
                headtype.options[24] = new Option('MEDIUMBLOB', 'MEDIUMBLOB');
                headtype.options[25] = new Option('LONGBLOB', 'LONGBLOB');
                headtype.options[26] = new Option('SET', 'SET');
                headtype.options[27] = new Option('ENUM', 'ENUM');
                headertype.appendChild(headtype);
                
                //header accuracy level cell
                var headeraccuracy = row.insertCell(4);
                var headacc = document.createElement('select');
                headacc.setAttribute('name', 'accuracylevels');
                headacc.setAttribute('id', 'a'+i);
                headacc.options[0] = new Option('0', '0');
                headacc.options[1] = new Option('1', '1');
                headacc.options[2] = new Option('2', '2');
                headacc.options[3] = new Option('3', '3');
                headacc.options[4] = new Option('4', '4');
                headacc.options[5] = new Option('5', '5');
                headacc.options[6] = new Option('6', '6');
                headacc.options[7] = new Option('7', '7');
                headacc.options[8] = new Option('8', '8');
                headacc.options[9] = new Option('9', '9');
                headacc.options[10] = new Option('10', '10');
                headeraccuracy.appendChild(headacc);
                hideselecttion(i);
                document.getElementById("tblSample").refresh();
            }
            
            function removeRowFromTable(){
                var tbl = document.getElementById('tblSample');
                var lastRow = tbl.rows.length;
                if (lastRow > 2) {
                    tbl.deleteRow(lastRow - 1);
                    i--;
                }
            }
            
            function uncheckclicked(no){
                var checkbox = document.getElementById("c" + no);
                var myhidden = document.getElementById("hi" + no);
                checkbox.checked = false;
                myhidden.value="false";
                var type = document.getElementById("t" + no);
                var acc = document.getElementById("a" + no);
                type.style.visibility = "hidden";
                if (acc != null) 
                    acc.style.visibility = "hidden";
            }
            
            function checkclicked(no){
                var checkbox = document.getElementById("c" + no);
                var myhidden = document.getElementById("hi" + no)
                checkbox.checked =true;
                myhidden.value="true";
                var type = document.getElementById("t" + no);
                var acc = document.getElementById("a" + no);
                var text = document.getElementById("i" + no).value;
                if (text.toLowerCase() == "length" || text.toLowerCase() == "width" || text.toLowerCase() == "weight" || text.toLowerCase() == "pages" || text.toLowerCase() == "depth" || text.toLowerCase() == "mailformat" || text.toLowerCase() == "format" || text.toLowerCase() == "items" || text.toLowerCase() == "prodcode") {
                    type.style.visibility = "visible";
                    if (acc != null) 
                        acc.style.visibility = "visible";
                }
                else {
                    type.style.visibility = "visible";
                }
            }
            
            function hideselecttion(no){
                var type = document.getElementById("t" + no);
                var acc = document.getElementById("a" + no);
                type.style.visibility = "hidden";
                if (acc != null) 
                    acc.style.visibility = "hidden";
            }
            
            function MyMethod(){
                for (j = 1; j <= i; j++) {
                    var colname = document.getElementById("i" + j).value;
                    if (colname.length == 0) {
                        document.getElementById("noname").innerHTML = "Please,Enter Column Name";
                        return false;
                    }
                }
                return true;
            }
        </script>
    </head>
    <body onload="hideselecttion(1);">
        <h2>Adding New provider (Step Three)</h2>
        <html:form action="/Next3" onsubmit="return MyMethod();">
            <p>
                <input type="button" value="Add Header" onclick="addRowToTable();"/><input type="button" value="Remove Header" onclick="removeRowFromTable();"/>
            </p>
            <table border="1" id="tblSample" style="width:100%;">
                <tr>
                    <th style="width:10%;">
                        Header Number
                    </th>
                    <th style="width:20%;">
                        Header Name
                    </th>
                    <th style="width:20%;">
                        Required
                    </th>
                    <th style="width:30%;">
                        Header Type
                    </th>
                    <th style="width:20%;">
                        Header Accuracy Level
                    </th>
                </tr>
                <tr>
                    <td>
                        Header 1
                    </td>
                    <td>
                        <input type="text" name="columnnames" id="i1" size="40"/>
                    <td>
                        <input type="checkbox" name="required" id="c1"/>
                        <input type="hidden" name="required" id="hi1" value="false"/>
                        <input type="button" name="Check" value="Check" onclick="checkclicked(1);"/><input type="button" name="UnCheck" value="UnCheck" onclick="uncheckclicked(1);"/>
                    </td>
                    <td>
                        <select name="columntypes" id="t1">
                            <option value="TINYINT">TINYINT</option>
                            <option value="SMALLINT">SMALLINT</option>
                            <option value="MEDIUMINT">MEDIUMINT</option>
                            <option value="INT">INT</option>
                            <option value="BIGINT">BIGINT</option>
                            <option value="DECIMAL">DECIMAL</option>
                            <option value="FLOAT">FLOAT</option>
                            <option value="DOUBLE">DOUBLE</option>
                            <option value="BIT">BIT</option>
                            <option value="CHAR">CHAR</option>
                            <option value="VARCHAR(45)">VARCHAR</option>
                            <option value="TINYTEXT">TINYTEXT</option>
                            <option value="TEXT">TEXT</option>
                            <option value="MEDIUMTEXT">MEDIUMTEXT</option>
                            <option value="LONGTEXT">LONGTEXT</option>
                            <option value="BINARY">BINARY</option>
                            <option value="VARBINARY(45)">VARBINARY</option>
                            <option value="DATE">DATE</option>
                            <option value="DATETIME">DATETIME</option>
                            <option value="TIME">TIME</option>
                            <option value="TIMESTAMP">TIMESTAMP</option>
                            <option value="YEAR">YEAR</option>
                            <option value="TINYBLOB">TINYBLOB</option>
                            <option value="BLOB">BLOB</option>
                            <option value="MEDIUMBLOB">MEDIUMBLOB</option>
                            <option value="LONGBLOB">LONGBLOB</option>
                            <option value="SET">SET</option>
                            <option value="ENUM">ENUM</option>
                        </select>
                    </td>
                    <td>
                        <select name="accuracylevels" id="a1">
                            <option value="0">0</option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                            <option value="7">7</option>
                            <option value="8">8</option>
                            <option value="9">9</option>
                            <option value="10">10</option>
                        </select>
                    </td>
                </tr>
            </table>
            <INPUT TYPE="BUTTON" VALUE="Previous" ONCLICK="window.location.href='ftpinfo.jsp'"/> 
            <html:submit value="Next"></html:submit>
            <INPUT TYPE="BUTTON" VALUE="Cancel" ONCLICK="window.location.href='AdminHome.jsp'"> 
        </html:form>
    </body>
</html>